<template>
    <div class="table">
        <p>hello testStore</p>
        <el-input-number
            v-model="cardNum"
            @change="handleChange"
            :min="1"
            :max="10"
            label="描述文字"
        ></el-input-number>
        <br />
        async:<el-input-number
            v-model="cardNumSync"
            @change="handleChangeSync"
            :min="1"
            :max="10"
            label="描述文字"
        ></el-input-number>
    </div>
</template>

<script>
// 使用 createNamespacedHelpers 创建基于某个命名空间辅助函数
import { createNamespacedHelpers } from "vuex";
const { mapMutations, mapActions } = createNamespacedHelpers("modulesCard"); // moduleName
export default {
    name: "TestStore",
    data() {
        return {
            cardNum: 0,
            cardNumSync: 0,
        };
    },
    computed: {},
    methods: {
        // 语法糖 mutations方法
        ...mapMutations({
            setCount: "SET_COUNTA",
        }),
        ...mapActions({
            setCountAsync: "setCountAsync",
        }),
        handleChange(value) {
            this.setCount(value);
        },
        handleChangeSync(value) {
            this.setCountAsync(value);
        },
    },
    mounted() {},
};
</script>
